<template>
  <div class="page-container">
    <a-card :bodyStyle="{ padding: '0' }" :bordered="false">
      <a-tabs v-model:active-key="activeTabkey">
        <a-tab-pane key="1" title="借调信息">
          <basicInfo />
        </a-tab-pane>
        <a-tab-pane key="2" title="费用信息">
          <feeInfo :carId="carId" :type="type" :code="carCode" />
        </a-tab-pane>
        <a-tab-pane key="3" title="操作记录" destroy-on-hide="true">
          <OperateLog :id="Number(route.params.id)" type="27" />
        </a-tab-pane>
      </a-tabs>
    </a-card>
  </div>
</template>

<script setup name="CarInspectDetail">
  import basicInfo from '../detail/components/basic-Info.vue'
  import feeInfo from '../detail/components/fee-info.vue'

  import { onMounted, ref } from 'vue'
  import { useRoute } from 'vue-router'
  import { getCarTransferDetail } from '@/api/asset/carTransfer'

  const route = useRoute()
  const query = route.query

  const carId = ref()
  const type = ref()
  const carCode = ref()
  const activeTabkey = ref('1')

  if (query.tab) {
    activeTabkey.value = query.tab
  }

  const getDetail = (id) => {
    getCarTransferDetail({ id }).then((res) => {
      const result = res.result
      console.log('getCarTransferDetail', result)

      carId.value = result.carId
      type.value = result.type
      carCode.value = result.code
    })
  }

  onMounted(() => {
    const id = route.params.id
    if (id) {
      getDetail(id)
    }
  })
</script>

<style lang="less" scoped></style>
